// JavaScript Document
// Se inicializa el seleccionador de fechas o datepicker del formulario
// calendar.gif se encuentra dentro del proyecto comprimido 
$(function () {
    $("#fecha_nacimiento").datepicker({
        changeYear: true,
        changeMonth: true,
        showOn: 'button',
        buttonImage: 'img/calendar.gif',
        buttonImageOnly: true
    });
    $("#fecha_nacimiento").datepicker("option", {
        dateFormat: "yy-mm-dd"
    });
    document.getElementById("fecha_nacimiento").value = "1980-01-01";
});

//validacion de los campos en que se van a ingresar los datos


function validar() {
    var valido = true;
    document.getElementById("nombre").className = "componente_formulario";
    document.getElementById("apellido").className = "componente_formulario";

    if (document.getElementById("nombre").value.length < 1) {
        document.getElementById("nombre").className = "ui-state-error componente_formulario";
        valido = false;
    }
    if (document.getElementById("apellido").value.length < 1) {
        document.getElementById("apellido").className = "ui-state-error componente_formulario";
        valido = false;
    }
    return valido;
}
//funcion llamada desde el formulario para iniciar el proceso de insercion de datos


function ingresarEmpleado() {
    var genero = "";
    if (document.getElementsByName("genero").item(0).checked) genero = document.getElementsByName("genero").item(0).value;
    else genero = document.getElementsByName("genero").item(1).value;
    //Si es cierto envia los datos con ajax (con jQuery) a ingresarEmpleado.jsp
    if (validar()) {
        document.getElementById("nombre").className = "componente_formulario";
        document.getElementById("apellido").className = "componente_formulario";
        var datos = "nombre=" + document.getElementById("nombre").value + "&apellido=" + document.getElementById("apellido").value + "&fecha_nacimiento=" + document.getElementById("fecha_nacimiento").value + "&genero=" + genero;
        document.getElementById("mensajes").innerHTML = "...";
        //ajax
        jQuery.post("JSP/ingresarEmpleado.jsp", datos, function (msg) {
            document.getElementById("mensajes").innerHTML = msg;
            listarEmpleados(); //"Registro Ingresado...";
        });
    } else {
        document.getElementById("mensajes").innerHTML = "Llene Correctamente Los Campos...";
    }
}
//mostrar lista de Empleado cuando se necesite refrescar datos en pantalla con ajax(usando jQuery)


function listarEmpleados() {
    //ajax
    jQuery.post("JSP/listarEmpleados.jsp", "", function (msg) {
        document.getElementById("listaEmpleados").innerHTML = msg;
    });
}